<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Calendar — <{:C('site_title')}></title>
<include file="Public:cssjs" />
<link rel="stylesheet" href="<{:RES}>/css/in.css">
<link rel="stylesheet" href="<{:STATICS}>/centaurus/css/libs/fullcalendar.css" type="text/css"/>
<link rel="stylesheet" href="<{:STATICS}>/centaurus/css/libs/fullcalendar.print.css" type="text/css" media="print"/>
<link rel="stylesheet" href="<{:STATICS}>/centaurus/css/compiled/calendar.css" type="text/css" media="screen"/>
<script src="<{:STATICS}>/centaurus/js/fullcalendar.min.js"></script> 
</head>
<body>
<include file="Public:mobilemenu" />

<div id="siteWrapper">	
	<div class="blackHeader">
	<include file="Public:menu" />
	</div>	
	
	<div id="calendar"></div>
	

	<include file="Public:footer" />	
</div>

<script>
$(document).ready(function() {

	/* initialize the calendar
	-----------------------------------------------------------------*/
	
	var date = new Date();
	var d = date.getDate();
	var m = date.getMonth();
	var y = date.getFullYear();

	var calendar = $('#calendar').fullCalendar({
		header: {
			left: 'prev,next today',
			center: 'title',
			//right: 'month,agendaWeek,agendaDay'
			right: ''
		},
		isRTL: $('body').hasClass('rtl'), //rtl support for calendar
		selectable: true,
		selectHelper: true,
		/*select: function(start, end, allDay) {
			var title = prompt('Event Title:');
			if (title) {
				calendar.fullCalendar('renderEvent',
					{
						title: title,
						start: start,
						end: end,
						allDay: allDay
					},
					true // make the event "stick"
				);
			}
			calendar.fullCalendar('unselect');
		},*/
		editable: false,
		droppable: true, // this allows things to be dropped onto the calendar !!!
		drop: function(date, allDay) { // this function is called when something is dropped
		
			// retrieve the dropped element's stored Event Object
			var originalEventObject = $(this).data('eventObject');
			
			// we need to copy it, so that multiple events don't have a reference to the same object
			var copiedEventObject = $.extend({}, originalEventObject);
			
			// assign it the date that was reported
			copiedEventObject.start = date;
			copiedEventObject.allDay = allDay;
			
			// copy label class from the event object
			var labelClass = $(this).data('eventclass');
			
			if (labelClass) {
				copiedEventObject.className = labelClass;
			}
			
			// render the event on the calendar
			// the last `true` argument determines if the event "sticks" (http://arshaw.com/fullcalendar/docs/event_rendering/renderEvent/)
			$('#calendar').fullCalendar('renderEvent', copiedEventObject, true);
			
			// is the "remove after drop" checkbox checked?
			if ($('#drop-remove').is(':checked')) {
				// if so, remove the element from the "Draggable Events" list
				$(this).remove();
			}
			
		},
		
		events: [	
			<volist name="list" id="vo">		
			{
			title: '<{$vo.title}>',
			start: new Date(<{$vo.date|date="Y,m,d",###}>),
			end: new Date(<{$vo.date|date="Y,m,d",###}>),
			url: '<{:U('Calendar/view',array('id'=>$vo['id']))}>',
			},
			</volist>
		]
	});
});
</script>

</body>
</html>